<template>


    <a-select :value="modelValue" allow-clear @change="handleChange" :mode="mode" placeholder="请选择角色">
        <a-select-option v-for="item in options" :key="item.id" :value="item.id">
            {{ item.name }}
        </a-select-option>
    </a-select>

</template>


<script setup lang="ts">
import { getRoleList } from '@/api/system/permission/role'

const props = defineProps<{
    modelValue: string | number,
    mode?: 'multiple' | 'tags' | 'combobox'
}>()

const options = ref([])

onMounted(async () => {
    const res = await getRoleList()
    options.value = res.lists
})

const handleChange = (value: string | number | null) => {
    emit('update:modelValue', value || '')
}





</script>
